// 主页面业务逻辑文件

/**
 * 页面加载完成后执行的初始化函数
 */
async function initMainPage() {
    console.log('主页面初始化完成');
    
    // 检查用户登录状态（异步执行）
    try {
        await checkUserLoginStatus();
    } catch (error) {
        console.error('检查用户登录状态时发生错误:', error);
    }
    
    // 加载车辆列表
    try {
        await loadCarList();
    } catch (error) {
        console.error('加载车辆列表时发生错误:', error);
    }
    
    // 初始化搜索功能
    initSearchFunctionality();
}

/**
 * 存储原始车辆列表数据
 */
let originalCarList = [];

/**
 * 初始化搜索功能
 */
function initSearchFunctionality() {
    const searchInput = document.querySelector('.new-search-bar .search-input');
    const searchBtn = document.querySelector('.new-search-bar .search-btn');
    
    if (!searchInput || !searchBtn) {
        console.warn('未找到搜索栏元素，搜索功能无法初始化');
        return;
    }
    
    // 添加搜索按钮点击事件
    searchBtn.addEventListener('click', performSearch);
    
    // 添加输入框回车事件
    searchInput.addEventListener('keypress', function(event) {
        if (event.key === 'Enter') {
            performSearch();
        }
    });
    
    // 使用防抖优化实时搜索体验
    const debouncedSearch = window.SearchUtils ? 
        window.SearchUtils.debounce(performSearch, 300) : null;
    
    // 添加输入事件（实时搜索）
    if (debouncedSearch) {
        searchInput.addEventListener('input', debouncedSearch);
    }
}

/**
 * 执行搜索
 */
function performSearch() {
    const searchInput = document.querySelector('.new-search-bar .search-input');
    if (!searchInput) {
        return;
    }
    
    const keyword = searchInput.value;
    
    // 执行前端搜索
    const searchResults = window.SearchUtils ? 
        window.SearchUtils.search(originalCarList, keyword, ['brand', 'model', 'color', 'instances.licensePlate', 'powerType']) : 
        [];
    
    // 限制显示10辆车
    const resultsToDisplay = searchResults.slice(0, 10);
    
    // 渲染搜索结果
    renderCarList(resultsToDisplay);
}

/**
 * 检查用户登录状态
 */
async function checkUserLoginStatus() {
    console.log('开始检查用户登录状态');
    // 首先检测是否有cookie或使用工具函数获取令牌
    let token = null;
    
    // 尝试使用两个不同的令牌管理工具获取令牌
    try {
        // 尝试使用window.utils.cookie
        if (window.utils && window.utils.cookie && window.utils.cookie.getAuthToken) {
            console.log('使用window.utils.cookie.getAuthToken获取令牌');
            token = window.utils.cookie.getAuthToken();
            console.log('通过window.utils.cookie获取的令牌:', token ? '存在' : '不存在');
        }
        
        // 如果第一个工具没有获取到令牌，尝试使用第二个工具
        if (!token && window.AuthTokenManager && window.AuthTokenManager.getAuthToken) {
            console.log('使用window.AuthTokenManager.getAuthToken获取令牌');
            token = window.AuthTokenManager.getAuthToken();
            console.log('通过window.AuthTokenManager获取的令牌:', token ? '存在' : '不存在');
        }
        
        // 如果两个工具都没有获取到令牌，使用传统方式从cookie中读取
        if (!token) {
            console.log('使用传统方式从cookie中读取令牌');
            if (document.cookie && document.cookie.trim() !== '') {
                const cookies = document.cookie.split(';');
                for (let i = 0; i < cookies.length; i++) {
                    const cookie = cookies[i].trim();
                    if (cookie.startsWith('auth_token=')) {
                        token = cookie.substring('auth_token='.length);
                        if (token && token.trim() !== '') {
                            break;
                        }
                    }
                }
            }
            console.log('通过传统方式获取的令牌:', token ? '存在' : '不存在');
        }
    } catch (error) {
        console.error('解析cookie时发生错误:', error);
    }
    
    // 如果没有令牌，保持在主页面
    if (!token) {
        console.log('没有检测到令牌，保持在主页面');
        return;
    }
    
    // 验证令牌格式
    if (!isValidTokenFormat(token)) {
        console.log('令牌格式无效，清除令牌');
        if (window.utils && window.utils.cookie && window.utils.cookie.removeAuthToken) {
            window.utils.cookie.removeAuthToken();
        }
        return;
    }
    
    // 令牌读取成功，准备调用API验证令牌
    console.log('令牌读取成功，准备调用API验证令牌');
    
    try {
        // 调用API验证令牌
        if (window.api && window.api.auth && window.api.auth.validateToken) {
            const validationResult = await window.api.auth.validateToken(token);
            
            if (validationResult && validationResult.success && validationResult.code === 3000) {
                // 令牌验证成功，创建用户信息对象
                const userInfo = {
                    id: null, // 可以通过getUserInfo获取更详细的用户信息
                    username: validationResult.username,
                    nickname: validationResult.username,
                    avatar: '',
                    role: 'user'
                };
                
                // 显示用户信息
                displayUserInfo(userInfo);
            }
        } else {
            console.error('未找到验证令牌的API函数');
        }
    } catch (error) {
        console.error('验证令牌失败:', error);
        // 验证失败时，清除令牌并提示用户重新登录
        if (window.utils && window.utils.cookie && window.utils.cookie.removeAuthToken) {
            window.utils.cookie.removeAuthToken();
            console.log('验证失败，已清除令牌');
        }
        
        // 显示用户友好的错误提示
        console.log('令牌验证失败，请重新登录');
        // 可以选择显示一个提示框或重定向到登录页面
        // alert('登录状态已过期，请重新登录');
    }
}

/**
 * 显示用户信息并隐藏登录注册按钮
 * @param {Object} userInfo - 用户信息对象
 */
function displayUserInfo(userInfo) {
    console.log('显示用户信息:', userInfo);
    
    try {
        // 隐藏登录和注册按钮
        const loginButton = document.querySelector('.login-btn');
        const registerButton = document.querySelector('.register-btn');
        const logoutButton = document.querySelector('.logout-btn');
        const usernameElement = document.querySelector('.username');
        
        if (loginButton) {
            loginButton.style.display = 'none';
        }
        
        if (registerButton) {
            registerButton.style.display = 'none';
        }
        
        if (logoutButton) {
            logoutButton.style.display = 'inline-block';
        }
        
        if (usernameElement) {
            usernameElement.textContent = userInfo.nickname || '用户';
        }
        
        console.log('用户信息已显示，登录和注册按钮已隐藏');
    } catch (error) {
        console.error('显示用户信息时发生错误:', error);
    }
}

/**
 * 退出登录功能
 */
function handleLogout() {
    console.log('执行退出登录');
    
    // 清除令牌
    if (window.utils && window.utils.cookie && window.utils.cookie.removeAuthToken) {
        window.utils.cookie.removeAuthToken();
    } else {
        // 如果没有工具函数，则手动清除cookie
        document.cookie = 'auth_token=; Max-Age=-99999999; path=/';
    }
    
    // 刷新页面或重定向到登录页
    alert('退出登录成功！');
    window.location.reload();
}

/**
 * 验证令牌格式是否正确
 * @param {string} token - 要验证的令牌
 * @returns {boolean} - 如果格式正确返回true，否则返回false
 */
function isValidTokenFormat(token) {
    if (!token || typeof token !== 'string') {
        return false;
    }
    
    // 令牌格式：token_u{用户ID}_{UUID}_{随机字符串}_{时间戳}
    const tokenPattern = /^token_u\d+_[a-f0-9]{32}_[a-zA-Z0-9]{16}_\d+$/;
    return tokenPattern.test(token);
}

/**
 * 获取状态显示文本
 * @param {number} status - 车辆状态(0=可租用，1=已租出，2=维护中)
 */
function getStatusText(status) {
    const statusMap = {
        0: '可租用',
        1: '已租出',
        2: '维护中'
    };
    return statusMap[status] || '未知';
}

/**
 * 格式化日期时间显示
 * @param {string|Date} date - 日期对象或日期字符串
 * @returns {string} 格式化后的日期字符串
 */
function formatDate(date) {
    if (!date) return '--';
    try {
        const d = new Date(date);
        const year = d.getFullYear();
        const month = String(d.getMonth() + 1).padStart(2, '0');
        const day = String(d.getDate()).padStart(2, '0');
        return `${year}-${month}-${day}`;
    } catch (error) {
        return date.toString().split('T')[0] || '--';
    }
}

/**
 * 加载车辆列表 - 连接后端API获取数据
 */
async function loadCarList() {
    console.log('开始加载车辆列表');
    
    try {
        // 调用API获取车辆列表
        let cars = [];
        
        // 调试日志
        console.log('检查window对象:', window);
        console.log('检查window.api对象:', window.api);
        console.log('检查window.api.cars对象:', window.api && window.api.cars);
        console.log('检查window.api.cars.getCarList方法:', window.api && window.api.cars && window.api.cars.getCarList);
        
        // 尝试使用window.api.cars.getCarList获取车辆列表
        if (window.api && window.api.cars && window.api.cars.getCarList) {
            console.log('使用window.api.cars.getCarList获取车辆列表');
            const result = await window.api.cars.getCarList({ page: 1, pageSize: 10 });
            
            // 检查返回结果是否有效
            if (!result) {
                console.error('API返回结果为空');
                showErrorMessage('获取车辆列表失败，请稍后重试');
                renderCarList([]);
                return;
            }
            
            // 根据后端返回的格式处理数据
            if (result.success === true) {
                // 处理API返回的数据格式
                if (result.data && result.data.items) {
                    // 如果data中有items字段
                    cars = result.data.items;
                } else if (result.data && Array.isArray(result.data)) {
                    // 如果data本身是数组
                    cars = result.data;
                } else {
                    console.error('API返回数据格式不正确:', result);
                    showErrorMessage('获取车辆列表失败，数据格式错误');
                }
            } else {
                // 处理API返回的错误
                const errorMessage = result.message || result.error || '获取车辆列表失败，请稍后重试';
                console.error('API调用失败:', errorMessage);
                showErrorMessage(errorMessage);
            }
        } else {
            console.error('未找到车辆API函数');
            showErrorMessage('系统错误，请稍后重试');
        }
        
        // 保存原始车辆数据，用于前端搜索
        originalCarList = cars;
        
        // 限制显示10辆车
        const carsToDisplay = cars.slice(0, 10);
        
        // 渲染车辆列表
        renderCarList(carsToDisplay);
    } catch (error) {
        console.error('加载车辆列表失败:', error);
        // 显示详细的错误信息
        const errorMessage = error.message || '网络错误，请检查您的网络连接或后端服务是否正常运行';
        showErrorMessage(errorMessage);
        // 显示空状态
        renderCarList([]);
    }
}

/**
 * 显示错误消息
 * @param {string} message - 错误消息内容
 */
function showErrorMessage(message) {
    // 创建错误提示元素
    const errorElement = document.createElement('div');
    errorElement.className = 'error-message';
    errorElement.textContent = message;
    
    // 添加到页面中
    const container = document.querySelector('.container');
    if (container) {
        // 检查是否已存在错误提示，如果有则移除
        const existingError = document.querySelector('.error-message');
        if (existingError) {
            container.removeChild(existingError);
        }
        
        // 添加到搜索栏下方
        const searchBar = document.querySelector('.new-search-bar');
        if (searchBar) {
            container.insertBefore(errorElement, searchBar.nextSibling);
        } else {
            container.appendChild(errorElement);
        }
        
        // 3秒后自动移除错误提示
        setTimeout(() => {
            if (errorElement.parentNode) {
                container.removeChild(errorElement);
            }
        }, 3000);
    }
}

/**
 * 渲染车辆列表
 * @param {Array} cars - 车辆数据数组
 */
function renderCarList(cars) {
    console.log('渲染车辆列表，共', cars.length, '辆车');
    
    const carListElement = document.getElementById('carList');
    if (!carListElement) {
        console.error('未找到车辆列表面板');
        return;
    }
    
    // 清空现有内容
    carListElement.innerHTML = '';
    
    // 如果没有车辆数据，显示提示信息
    if (!cars || cars.length === 0) {
        carListElement.innerHTML = '<div class="no-cars">暂无可用车辆</div>';
        return;
    }
    
    // 创建车辆列表项
    cars.forEach(car => {
        const carItem = document.createElement('div');
        carItem.className = 'car-item';
        
        // 从车辆实例中获取车牌号、状态和可租时间等信息（取第一个可用的实例）
        let licensePlate = '未知';
        let status = 0; // 默认可租用
        let availableStart = '';
        let availableEnd = '';
        let rentalCount = 0;
        if (car.instances && car.instances.length > 0) {
            licensePlate = car.instances[0].licensePlate || '未知';
            status = car.instances[0].status || 0;
            availableStart = car.instances[0].availableStart || '';
            availableEnd = car.instances[0].availableEnd || '';
            rentalCount = car.instances[0].rentalCount || 0;
        }
        
        // 获取日租信息（使用后端返回的dailyRate字段）
        const dailyRate = car.dailyRate || 0;
        
        // 重新排版的车辆信息HTML，优化信息层级和视觉布局
        carItem.innerHTML = `
            <div class="car-image-container">
                <img src="./img/car.jpg" alt="${car.brand} ${car.model}" class="car-image">
            </div>
            <div class="car-info">
                <div class="car-name-section">
                    <div class="car-name">${car.brand} ${car.model}</div>
                    <div class="car-basic-info">
                        <span class="car-color">${car.color || '未知'}</span>
                        <span class="car-seats">${car.seatCount || 5}座</span>
                        <span class="car-power">${car.powerType || '自动'}</span>
                    </div>
                </div>
                <div class="car-details-row">
                    <div class="car-detail-item">
                        <span class="detail-label">车牌号:</span>
                        <span class="detail-value">${licensePlate}</span>
                    </div>
                    <div class="car-detail-item">
                        <span class="detail-label">状态:</span>
                        <span class="detail-value status-${status}">${getStatusText(status)}</span>
                    </div>
                    <div class="car-detail-item">
                        <span class="detail-label">租用次数:</span>
                        <span class="detail-value">${rentalCount}次</span>
                    </div>
                </div>
                ${availableStart || availableEnd ? `
                <div class="car-availability">
                    ${availableStart ? `<div class="availability-item">
                        <span class="detail-label">可租开始:</span>
                        <span class="detail-value">${formatDate(availableStart)}</span>
                    </div>` : ''}
                    ${availableEnd ? `<div class="availability-item">
                        <span class="detail-label">可租结束:</span>
                        <span class="detail-value">${formatDate(availableEnd)}</span>
                    </div>` : ''}
                </div>
                ` : ''}
            </div>
            <div class="car-actions">
                <div class="price-section">
                    <div class="price-label">日租金</div>
                    <div class="daily-price">¥${dailyRate}<span class="price-unit">/天</span></div>
                </div>
                <button class="reserve-btn" onclick="window.location.href='./pages/reservation-form.html?carId=${car.id || 1}&brand=${encodeURIComponent(car.brand || '')}&model=${encodeURIComponent(car.model || '')}&color=${encodeURIComponent(car.color || '')}&dailyRate=${car.dailyRate || 0}&licensePlate=${encodeURIComponent(licensePlate || '')}&status=${status}&seatCount=${car.seatCount || 5}&powerType=${encodeURIComponent(car.powerType || '自动')}&rentalCount=${rentalCount}&availableStart=${encodeURIComponent(availableStart || '')}&availableEnd=${encodeURIComponent(availableEnd || '')}'">预约</button>
            </div>
        `;
        
        // 添加到车辆列表面板
        carListElement.appendChild(carItem);
    });
}

// 页面加载完成后执行初始化
document.addEventListener('DOMContentLoaded', initMainPage);